import React, { Component } from 'react'
import "./TodoHeader.css";

export default class TodoHeader extends Component {
  render() {
    return (
        <div className="todo-header">
            <input
                type="text"
                placeholder="请输入你的任务名称，按回车键确认"
                onKeyDown={this.add}
            />
        </div>
    )
  }

  //新增任务
  add = (e) => {
    //判断是否为回车键
    if(e.keyCode === 13){
      //调用父级的 add 方法
      this.props.addTodo(e.target.value);
      //清空文本框中的内容
      e.target.value = '';
    }
  }
}
